﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <link rel="shortcut icon" href="assets/img/favicon.png" type="image/x-icon">
    <title>Beyond Admin - Landing</title>
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/pe.css">
    <link rel="stylesheet" href="assets/css/portfolio-page.min.css">
</head>
<body class="portfolio-page">
    <div class="parallax-image-wrapper parallax-image-wrapper-100"
         data-anchor-target="#slide-cover"
         data-bottom-top="transform:translate3d(0px, 200%, 0px)"
         data-top-bottom="transform:translate3d(0px, 0%, 0px)">
        <div class="parallax-image parallax-image-100"
             style="background-image: url(assets/img/cover-bg-2.jpg)"
             data-anchor-target="#slide-cover"
             data-bottom-top="transform: translate3d(0px, -80%, 0px);"
             data-top-bottom="transform: translate3d(0px, 80%, 0px);"></div>
    </div>
    <div class="parallax-image-wrapper parallax-image-wrapper-100"
         data-anchor-target="#slide-video"
         data-bottom-top="transform:translate3d(0px, 200%, 0px)"
         data-top-bottom="transform:translate3d(0px, 0%, 0px)">
        <div class="parallax-image parallax-image-100"
             style="background-image: url(assets/img/video-bg-3.jpg)"
             data-anchor-target="#slide-video"
             data-bottom-top="transform: translate3d(0px, -80%, 0px);"
             data-top-bottom="transform: translate3d(0px, 80%, 0px);"></div>
    </div>
    <nav class="navbar navbar-default navbar-fixed-top" data-anchor-target="#slide-cover" data-0="@class:navbar navbar-default navbar-fixed-top;" data-0-bottom="@class:navbar navbar-default navbar-fixed-top other-pages;">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand page-scroll" href="/landing.html/#slide-cover">
                <img src="assets/img/logo.png" />
            </a>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
            <ul class="nav navbar-nav navbar-right">
                <li>
                    <a class="page-scroll" href="/landing.html/#slide-slogan">Who are We?</a>
                </li>
                <li>
                    <a class="page-scroll" href="/landing.html/#slide-works">Our Works</a>
                </li>
                <li>
                    <a class="page-scroll" href="/landing.html/#slide-video">Videography</a>
                </li>
                <li>
                    <a class="page-scroll" href="/landing.html/#slide-features">Our Ethics</a>
                </li>
                <li>
                    <a class="page-scroll" href="/landing.html/#slide-testimonial">Testimonials</a>
                </li>
                <li>
                    <a class="page-scroll" href="/landing.html/#slide-map">Say Hello</a>
                </li>
                <li>
                    <a class="signin" href="">Sing In</a>
                </li>
            </ul>
        </div><!--/.nav-collapse -->
    </nav>
    <div id="skrollr-body">
        <!-- Cover Slide -->
        <div class="gap gap-100 slide-cover" id="slide-cover" style="background-image: url(assets/img/cover-bg-2.jpg);">
            <h1 class="cover-statement">
                People
                <br />
                First
                <br />
                Strategy
            </h1>
            <div class="cover-link">
                <a class="page-scroll" href="/landing.html/#slide-video">
                    <span>
                        Watch Video
                    </span>
                </a>
            </div>
        </div>
        <!-- Slogan Slide -->
        <div class="gap slide-slogan" id="slide-slogan">
            <div class="block-wrapper inner-content">
                <div class="slogan">
                    <p class="slogan-title">
                        There is a <span class="title-word">Designer</span>
                        <br />
                        in all of us.
                    </p>
                    <div class="slogan-separator"></div>
                    <p class="slogan-description">
                        Lorem ipsum dolor sit amet, ex nec elitr virtute, dicit singulis ea vel. Affert alienum ne sea, at eum unum eius, audire ponderum et usu. Possim periculis dissentiet ne usu. No his justo omittantur. Ei quo sumo intellegebat, eu oratio deserunt tacimates per, quo sonet nominavi voluptaria an. Eros graecis recteque te per.
                        Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur. Eu augue doctus ocurreret pro, has appareat similique accommodare eu.
                    </p>
                    <p class="slogan-description">
                        Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur. Eu augue doctus ocurreret pro, has appareat similique accommodare eu.
                    </p>
                    <div class="slogan-action">
                        <a href="">
                            Let your inside <span class="action-word">Designer</span>  decide
                        </a>
                    </div>
                </div>
            </div>
        </div>
        <!-- Works Slide -->
        <div class="gap slide-works" id="slide-works">
            <div class="row">
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <a class="work" href="">
                        <div class="work-content" style="background-image: url(assets/img/works/w1.jpg)">
                            <div class="work-text">
                                <div class="text-wrapper">
                                    <h4>Beyond Admin</h4>
                                    <p>Designed By BeyondThemes</p>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <a class="work" href="">
                        <div class="work-content" style="background-image: url(assets/img/works/w2.jpg)">
                            <div class="work-text">
                                <div class="text-wrapper">
                                    <h4>Beyond Admin</h4>
                                    <p>Designed By BeyondThemes</p>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <a class="work" href="">
                        <div class="work-content" style="background-image: url(assets/img/works/w3.jpg)">
                            <div class="work-text">
                                <div class="text-wrapper">
                                    <h4>Beyond Admin</h4>
                                    <p>Designed By BeyondThemes</p>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <a class="work" href="">
                        <div class="work-content" style="background-image: url(assets/img/works/w4.jpg)">
                            <div class="work-text">
                                <div class="text-wrapper">
                                    <h4>Beyond Admin</h4>
                                    <p>Designed By BeyondThemes</p>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <a class="work" href="">
                        <div class="work-content" style="background-image: url(assets/img/works/w5.jpg)">
                            <div class="work-text">
                                <div class="text-wrapper">
                                    <h4>Beyond Admin</h4>
                                    <p>Designed By BeyondThemes</p>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <a class="work" href="">
                        <div class="work-content" style="background-image: url(assets/img/works/w6.jpg)">
                            <div class="work-text">
                                <div class="text-wrapper">
                                    <h4>Beyond Admin</h4>
                                    <p>Designed By BeyondThemes</p>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <a class="work" href="">
                        <div class="work-content" style="background-image: url(assets/img/works/w7.jpg)">
                            <div class="work-text">
                                <div class="text-wrapper">
                                    <h4>Beyond Admin</h4>
                                    <p>Designed By BeyondThemes</p>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <a class="work" href="">
                        <div class="work-content" style="background-image: url(assets/img/works/w8.jpg)">
                            <div class="work-text">
                                <div class="text-wrapper">
                                    <h4>Beyond Admin</h4>
                                    <p>Designed By BeyondThemes</p>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
            <div class="works-more">
                <a href="" class="more-link">See Our Preious Works</a>
            </div>
        </div>
        <!-- Video Slide -->
        <div class="gap gap-100 slide-video" id="slide-video" style="background-image: url(assets/img/video-bg-3.jpg);">
            <div class="video-wrapper">
                <img src="assets/img/video-bg-3.jpg" class="video-bg" id="video-bg" />
                <video id="beyondadmin-video" poster="data:image/gif,AAAA">
                    <source type="video/mp4" />
                </video>
            </div>
            <div class="video-statement">
                <p class="statement-title">
                    Our Videography
                </p>
                <p class="statement-description">
                    See how we helped them get the best price for the products that they wanted to buy. On an average our customers save 25% on their enterprise costs. On an average our customers save 25% on their enterprise costs.
                </p>
                <i class="pe-play" onclick="vidplay() "></i>
            </div>
        </div>
        <!-- Features Slide -->
        <div class="content slide-features" id="slide-features">
            <div class="row">
                <div class="col-lg-6 col-sm-12">
                    <div class="features-text ">
                        <div class="heading">
                            <h3>How BeyondAdmin Works.</h3>
                        </div>
                        <div>
                            <p>
                                Lorem ipsum dolor sit amet, ex nec elitr virtute, dicit singulis ea vel. Affert alienum ne sea, at eum unum eius, audire ponderum et usu. Possim periculis dissentiet ne usu. No his justo omittantur. Ei quo sumo intellegebat, eu oratio deserunt tacimates per, quo sonet nominavi voluptaria an. Eros graecis recteque te per.
                                <br />
                                Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur. Eu augue doctus ocurreret pro, has appareat similique accommodare eu.
                            </p>
                            <p>
                                Lorem ipsum dolor sit amet, ex nec elitr virtute, dicit singulis ea vel. Affert alienum ne sea, at eum unum eius, audire ponderum et usu. Possim periculis dissentiet ne usu. No his justo omittantur. Ei quo sumo intellegebat, eu oratio deserunt tacimates per, quo sonet nominavi voluptaria an. Eros graecis recteque te per.
                                <br />
                                Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur. Eu augue doctus ocurreret pro, has appareat similique accommodare eu.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 col-sm-12">
                    <div class="features-image">
                        <img alt="Microsoft Health" style="width: 40%;" src="assets/img/mobile.png" />
                    </div>
                </div>
                <div class="clearfix"></div>
            </div>
            <div class="row">
                <div class="col-lg-6 col-sm-12">
                    <div class="features-image">
                        <img alt="Microsoft Health" style="width: 75%;" src="assets/img/pc.png" />
                    </div>
                </div>
                <div class="col-lg-6 col-sm-12">
                    <div class="features-text ">
                        <div class="heading">
                            <h3>How BeyondAdmin Works.</h3>
                        </div>
                        <div>
                            <p>
                                Lorem ipsum dolor sit amet, ex nec elitr virtute, dicit singulis ea vel. Affert alienum ne sea, at eum unum eius, audire ponderum et usu. Possim periculis dissentiet ne usu. No his justo omittantur. Ei quo sumo intellegebat, eu oratio deserunt tacimates per, quo sonet nominavi voluptaria an. Eros graecis recteque te per.
                                <br />
                                Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur. Eu augue doctus ocurreret pro, has appareat similique accommodare eu.
                            </p>
                            <p>
                                Lorem ipsum dolor sit amet, ex nec elitr virtute, dicit singulis ea vel. Affert alienum ne sea, at eum unum eius, audire ponderum et usu. Possim periculis dissentiet ne usu. No his justo omittantur. Ei quo sumo intellegebat, eu oratio deserunt tacimates per, quo sonet nominavi voluptaria an. Eros graecis recteque te per.
                                <br />
                                Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur. Eu augue doctus ocurreret pro, has appareat similique accommodare eu.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="clearfix"></div>
            </div>
            <div class="row">
                <div class="col-lg-6 col-sm-12">
                    <div class="features-text ">
                        <div class="heading">
                            <h3>How BeyondAdmin Works.</h3>
                        </div>
                        <div>
                            <p>
                                Lorem ipsum dolor sit amet, ex nec elitr virtute, dicit singulis ea vel. Affert alienum ne sea, at eum unum eius, audire ponderum et usu. Possim periculis dissentiet ne usu. No his justo omittantur. Ei quo sumo intellegebat, eu oratio deserunt tacimates per, quo sonet nominavi voluptaria an. Eros graecis recteque te per.
                                <br />
                                Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur. Eu augue doctus ocurreret pro, has appareat similique accommodare eu.
                            </p>
                            <p>
                                Lorem ipsum dolor sit amet, ex nec elitr virtute, dicit singulis ea vel. Affert alienum ne sea, at eum unum eius, audire ponderum et usu. Possim periculis dissentiet ne usu. No his justo omittantur. Ei quo sumo intellegebat, eu oratio deserunt tacimates per, quo sonet nominavi voluptaria an. Eros graecis recteque te per.
                                <br />
                                Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur. Eu augue doctus ocurreret pro, has appareat similique accommodare eu.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 col-sm-12">
                    <div class="features-image">
                        <img alt="Microsoft Health" style="width: 75%" src="assets/img/laptop.png" />
                    </div>
                </div>
                <div class="clearfix"></div>
            </div>
            <div class="touts-container">
                <div class="toutsList">
                    <div class="row">
                        <div class="col-lg-3 col-sm-6 col-xs-12">
                            <div class="tout">
                                <div class="image-container">
                                    <i class="pe-users"></i>
                                </div>
                                <div class="text-container">
                                    <h3>2K+ Customers</h3>
                                    <p>
                                        Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur.
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6 col-xs-12">
                            <div class="tout">
                                <div class="image-container">
                                    <i class="pe-tools"></i>
                                </div>
                                <div class="text-container">
                                    <h3>Easy to Customize</h3>
                                    <p>
                                        Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur.
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6 col-xs-12">
                            <div class="tout">
                                <div class="image-container">
                                    <i class="pe-albums"></i>
                                </div>
                                <div class="text-container">
                                    <h3>4 Different Versions</h3>
                                    <p>
                                        Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur.
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6 col-xs-12">
                            <div class="tout">
                                <div class="image-container">
                                    <i class="pe-display1"></i>
                                </div>
                                <div class="text-container">
                                    <h3>Visualizing Componentes</h3>
                                    <p>
                                        Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur.
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Testimonial Slide -->
        <div class="content slide-testimonial" id="slide-testimonial">
            <div class="testimonial-header">
                <div class="testimonial-title">
                    Testimonials
                </div>
                <div class="testimonial-arrow">
                    <i class="pe-bottom-arrow"></i>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 col-sm-4 col-xs-12">
                    <div class="testimonial-item">
                        <div class="avatar">
                            <img src="assets/img/avatars/avatar1.jpg" />
                        </div>
                        <div class="qoute">
                            Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo graece.
                        </div>
                        <div class="splitter"></div>
                        <div class="person">
                            <span class="name">John Doe</span>,
                            <span class="position">Creative Director</span>
                            <div class="website">
                                <a href="google.com">Micrsoft Corp</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-sm-4 col-xs-12">
                    <div class="testimonial-item">
                        <div class="avatar">
                            <img src="assets/img/avatars/avatar2.jpg" />
                        </div>
                        <div class="qoute">
                            Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo graece.
                        </div>
                        <div class="splitter"></div>
                        <div class="person">
                            <span class="name">John Doe</span>,
                            <span class="position">Creative Director</span>
                            <div class="website">
                                <a href="google.com">Micrsoft Corp</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-sm-4 col-xs-12">
                    <div class="testimonial-item">
                        <div class="avatar">
                            <img src="assets/img/avatars/avatar3.jpg" />
                        </div>
                        <div class="qoute">
                            Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo graece.
                        </div>
                        <div class="splitter"></div>
                        <div class="person">
                            <span class="name">John Doe</span>,
                            <span class="position">Creative Director</span>
                            <div class="website">
                                <a href="google.com">Micrsoft Corp</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 col-sm-4 col-xs-12">
                    <div class="testimonial-item">
                        <div class="avatar">
                            <img src="assets/img/avatars/allison.jpg" />
                        </div>
                        <div class="qoute">
                            Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo graece.
                        </div>
                        <div class="splitter"></div>
                        <div class="person">
                            <span class="name">John Doe</span>,
                            <span class="position">Creative Director</span>
                            <div class="website">
                                <a href="google.com">Micrsoft Corp</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-sm-4 col-xs-12">
                    <div class="testimonial-item">
                        <div class="avatar">
                            <img src="assets/img/avatars/jared.jpg" />
                        </div>
                        <div class="qoute">
                            Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo graece.
                        </div>
                        <div class="splitter"></div>
                        <div class="person">
                            <span class="name">John Doe</span>,
                            <span class="position">Creative Director</span>
                            <div class="website">
                                <a href="google.com">Micrsoft Corp</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-sm-4 col-xs-12">
                    <div class="testimonial-item">
                        <div class="avatar">
                            <img src="assets/img/avatars/andy.jpg" />
                        </div>
                        <div class="qoute">
                            Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo graece.
                        </div>
                        <div class="splitter"></div>
                        <div class="person">
                            <span class="name">John Doe</span>,
                            <span class="position">Creative Director</span>
                            <div class="website">
                                <a href="google.com">Micrsoft Corp</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Map Slide -->
        <div id="slide-map" class="content slide-map">
            <div class="map-haeder">
                <div class="map-title">Say Hello!</div>
                <div class="container">
                    <form class="form-horizontal contact-form" role="form">
                        <div class="row">
                            
                            <div class="col-md-6">
                                <input type="text" name="name" placeholder="Name" class="form-control">
                            </div>
                            <div class="col-md-6">
                                <input type="email" name="email" placeholder="Email" class="form-control">
                            </div>
                        </div>
                        <textarea class="form-control" rows="5" placeholder="Message"></textarea>
                        <div class="text-center">
                            <button type="submit" class="btn btn-block">Send</button>
                        </div>
                    </form>
                </div>
            </div>
            <div class="map-container">
                <div class="map-overlay-top"></div>
                <div class="map" id="map"></div>
                <div class="map-overlay-bottom"></div>
            </div>

        </div>
        <!-- Footer -->
        <div id="slide-footer" class="slide-footer">
            <div class="footer-description">
                Ludus expetenda et his, per an fugit debet docendi. Aeque argumentum ea duo, te amet quaestio eam. Eam ex graece complectitur.
                <br />
                Aeque argumentum ea duo, te amet quaestio eam.
            </div>
            <div class="footer-title">
                Beyond Themes
            </div>
            <div class="footer-address">
                233 River Road
                <br />
                New London CT 06320
            </div>
            <div class="footer-tel">
                (412) 317-3700
            </div>
            <div class="footer-mail">
                info@beyond.com
            </div>
            <div class="footer-links">
                <a href="" class="link">Facebook</a> /
                <a href="" class="link">Twitter</a> /
                <a href="" class="link">Google+</a>
            </div>
        </div>
    </div>
    <!-- Main Refs -->
    <script src="assets/js/jquery-2.0.3.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <!-- Parallax -->
    <script type="text/javascript" src="assets/js/skrollr.min.js"></script>
    <!-- Scrooling -->
    <script src="assets/js/jquery.easing.1.3.js"></script>
    <!-- Map -->
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
    <script src="assets/js/gmaps/gmaps.min.js"></script>
    <!-- App -->
    <script src="assets/js/app.js"></script>
</body>
</html>